﻿<link href="~/css/site.css" rel="stylesheet" />
<script src="~/vue/dist/vue.global.js"></script>
<link href="~/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/element-plus/dist/index.full.js"></script>
<script src="~/axios/dist/axios.js">    </script>
<div id="app">
    <el-row>
        <el-col :span="24">
            您正在做的业务是：人力资源--权限管理--添加用
        </el-col>
    </el-row>
    <el-row>
        <el-col :span="24" style="text-align: right">
            <el-button type="primary" v-on:click="Xg()">提交</el-button>
            <el-button v-on:click="Fh()">返回</el-button>
        </el-col>
    </el-row>
    <el-row style="height: 10px"></el-row>
    <el-row style="text-indent: 10px">
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            用户名称
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-input v-model="user.UName" size="small" style="width: 250px;" />
        </el-col>
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            用户密码
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-input v-model="user.UPassWord" size="small" style="width: 250px;" />
        </el-col>
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            真实姓名
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-input v-model="user.UTrueName" size="small" style="width: 250px;" />
        </el-col>
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            用户身份
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-select v-model="user.rolesID" size="small" style="width: 250px;" placeholder="请选择">
                <el-option v-for="i in data" :label="i.rolesName" :value="i.rolesID" />
            </el-select>
        </el-col>
    </el-row>
</div>

<script type="text/javascript">
    const { createApp, ref, reactive } = Vue
    const { ElMessage } = ElementPlus
    var app = createApp({
        setup() {
            const data = ref([])
            const user = reactive({
                UId: null,
                UName: null,
                UTrueName: null,
                UPassWord: null,
                rolesID: null,
                userRolesID: null,
            })
            function Show() {
                axios.get("/Roles/GetRole2")
                    .then(res => {
                        data.value = res.data
                    })
                    .catch(err => {
                        console.log(err);
                    })
                axios.get("/Roles/GetUser2")
                    .then(res => {
                        console.log(res.data)
                        user.UId = res.data.uId
                        user.UName = res.data.uName
                        user.UTrueName = res.data.uTrueName
                        user.UPassWord = res.data.uPassWord
                        //user.rname = res.data.rname
                        axios.get("/Roles/UserRroesById",{
                            params:{
                                uid:res.data.uId
                            }
                        }).then(res=>{
                            user.rolesID = res.data.rolesID
                            user.userRolesID = res.data.userRolesID
                        }).catch(error=>{
                            console.info(error)
                        })
                    })
                    .catch(err => {
                        console.log(err);
                    })
            }
            function Xg() {
                let data = {
                    UserRolesID:user.userRolesID,UserID:user.UId,RolesID:user.rolesID
                }
                console.info(data)
                axios.put("/Roles/UserUpdate", null, {
                    params: user
                })
                    .then(res => {
                        if (res.data > 0){
                            axios.put("/Roles/UserRroesUpdate",{
                                userRoles:data
                            }, {
                        headers: {
                            "Content-type": "application/x-www-form-urlencoded",
                            //或其他格式
                        }
                    }).then(res=>{
                                if  (res.data>0){
                                    ElMessage({
                                    type: 'success',
                                    message: '修改成功！'});
                                    setInterval(()=>{
                                        window.location.href = "/Roles/Index1"
                                    },1000)
                                }
                            }).catch(error=>{
                                console.info(error)
                            })
                        }
                    })
                    .catch(err => {
                        console.log(err);
                    })
            }
            function Fh() {
                window.history.back()
            }
            Show()
            return {
                user,
                data,
                Xg,
                Fh,
            }
        }
    })
    app.use(ElementPlus)
    app.mount('#app')
</script>

<style scoped>
    body {
        background-color: #ffffcc;
    }
</style>